<!DOCTYPE html>
<html lang="">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
  <title>
    <%= htmlWebpackPlugin.options.title %>
  </title>
</head>

<body>
  <noscript>
    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
        Please enable it to continue.</strong>
  </noscript>
  <div id="app">
    <style>
      html[data-theme='dark'] .app-loading{background-color:#2c344a;}html[data-theme='dark'] .app-loading .app-loading-title{color:rgb(255 255 255 / 85%);}.app-loading{display:flex;width:100%;height:100%;justify-content:center;align-items:center;flex-direction:column;background-color:#f4f7f9;}.app-loading .app-loading-wrap{position:absolute;top:50%;left:50%;display:flex;transform:translate3d(-50%,-50%,0);justify-content:center;align-items:center;flex-direction:column;}.app-loading .dots{display:flex;padding:98px;justify-content:center;align-items:center;}.app-loading .app-loading-title{display:flex;margin-top:30px;font-size:30px;color:rgb(0 0 0 / 85%);justify-content:center;align-items:center;}.app-loading .app-loading-logo{display:block;width:90px;margin:0 auto;margin-bottom:20px;}.dot{position:relative;display:inline-block;width:48px;height:48px;margin-top:30px;font-size:32px;transform:rotate(45deg);box-sizing:border-box;animation:antRotate 1.2s infinite linear;}.dot i{position:absolute;display:block;width:20px;height:20px;background-color:#0065cc;border-radius:100%;opacity:30%;transform:scale(0.75);animation:antSpinMove 1s infinite linear alternate;transform-origin:50% 50%;}.dot i:nth-child(1){top:0;left:0;}.dot i:nth-child(2){top:0;right:0;animation-delay:0.4s;}.dot i:nth-child(3){right:0;bottom:0;animation-delay:0.8s;}.dot i:nth-child(4){bottom:0;left:0;animation-delay:1.2s;}@keyframes antRotate{to{transform:rotate(405deg);}}@keyframes antRotate{to{transform:rotate(405deg);}}@keyframes antSpinMove{to{opacity:100%;}}@keyframes antSpinMove{to{opacity:100%;}}
    </style>
    <div class="app-loading">
      <div class="app-loading-wrap">
        <img src="/img/logo.png" class="app-loading-logo" alt="Logo" />
        <div class="app-loading-dots">
          <span class="dot dot-spin"><i></i><i></i><i></i><i></i></span>
        </div>
        <div class="app-loading-title">
          <%= htmlWebpackPlugin.options.title %>
        </div>
      </div>
    </div>
  </div>
  </div>
  <!-- built files will be auto injected -->
</body>

</html>